<template>
  <div class="bg-[#00284d] w-[100%] h-[180px] flex justify-center items-center">
    <div class="flex flex-col justify-start h-[100%] about text-[#fff]">
      <h2 class="text-xl font-bold mb-2">{{ $t("footer.aboutUs") }}</h2>
      <p>{{ $t("footer.phone") }}: +65 87090166</p>
      <div class="flex justify-between">
        <p>{{ $t("footer.email") }}: aceaiflights@gmail.com</p>
        <!-- <p>{{ $t("footer.address") }}:{{ $t("footer.realAddress") }}</p> -->
        <a class="mr-[18%] text-[#fff] service" href="">Service Teams</a>
      </div>
    </div>
  </div>
  <div
    class="bg-[#01203d] w-[100%] h-[40px] text-[#fff] flex justify-center items-center"
  >
    <p class="text-xs">2023 ACE &Technology Services Pte. Ltd.</p>
  </div>
</template>
<script setup></script>
<style lang="scss" scoped>
.about {
  padding: 2% 0;
  width: 72%;
  p {
    font-size: 14px;
    margin-top: 1%;
    color: #81a3c2;
  }
  .service {
    text-decoration: underline;
  }
}
</style>
